const path = require('path')
const HtmlWebPackPlugin = require('html-webpack-plugin') // 导入 在内存中自动生成 index 页面的插件

// 创建一个插件的实例对象
const htmlPlugin = new HtmlWebPackPlugin({
	template: path.join(__dirname, './src/index.html'), // 源文件    __dirname指的是当前文件的根目录
	filename: 'index.html', // 生成的内存中首页的名称
})

// 向外暴露一个打包配置对象
module.exports = {
	mode: 'development', //production(会压缩)      development开发模式(不会压缩)
	// 在webpack4.x中约定默认的打包入口文件是  src->  index.js文件     若有此文件则不需要建立  entry   配置
	entry: './src/index.js',
	plugins: [htmlPlugin],
	module: {
		// 所有第三方 模块的配置规则
		rules: [
			// 第三方匹配规则
			{ test: /\.js|jsx$/, use: 'babel-loader', exclude: /node_modules/ }, // 千万别忘记添加 exclude 排除项
		],
	},
	resolve: {
		extensions: ['.js', '.jsx', '.json'], // 表示，这几个文件的后缀名，可以省略不写
		alias: {
			// 表示别名
			'@': path.join(__dirname, './src'), // 这样，@ 就表示 项目根目录中 src 的这一层路径
		},
	},
}

// 目前不支持此种写法    webpack支持node的api   此为es6向外导出api  与之对应是   improt xx  form ''    node 不支持
// export default {}
